<style>
    body{
        padding:0;
        margin:0;
        overflow:hidden;
    }
    div {
        padding: 80px;
        text-align: center;
    }
    h1{
        display: inline-block;
        color: #CA2A2A;
    	font-size: 40px;
    	padding: 20px;
        border-radius: 5px;
	box-shadow: 1px 1px 5px #999;
	animation-name: spin;
    	animation-duration: 1000ms;
    	animation-iteration-count: initial;
    	animation-timing-function: ease-out;
    }
    h1 span{
        color: #484877;
    }
    @keyframes spin {
        from {
            font-size: 10px;
            padding: 5px;
            transform:rotate(0deg);
        }
        to {
            font-size: 40px;
            padding: 20px;
            transform:rotate(360deg);
        }
    }
</style>
<div>
    <h1>Hello <span>{{name}}!</span></h1>
</div>